<script lang="ts" setup>
// withDefaults 用于指定传参的默认值 在defineProps<{}>() ，后加第二个对象
const props=withDefaults(


  defineProps<{
    isEdit: boolean,
    itemData: { [porps: string]: number }
  }>(),{
    itemData: () => ({
      "精品级配砂": 0,
      "精品瓜子片": 0,
      "精品二分石": 0,
      "精品三分石": 0,
      "石粉": 0,
      "瓜子片": 0,
      "三分石": 0,
      "机制砂": 0,
      "泥饼": 0,
      "粉末": 0,
    }),
    isEdit: false
  }
);
</script>
<template lang="pug">
.text-lg.text-gray-600.font-bold
  slot(name="title")
    | 请您于明天进厂装料
div(class="grid grid-cols-2 gap-4 items-center md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5")
  .flex(v-for="(value,i) in itemData")
    .leftt.break-normal {{ i }}：
    input.input.m-1.px-2(v-model="itemData[i]" placeholder="不修改" :readonly="!isEdit" type="number")
    .unit.flex-auto 吨
</template>
<style lang="scss" scoped>
@import "/src/tailwind.scss";
.leftt {
  width: 110px;
}
.input {
  box-shadow: inset 1px 1px 3px #ccc;
  width: 90px;
  background-color: #f0faf2;
  border: none;
  &:focus {
    border: none;
    // box-shadow: 0 0 0 1px #ccc, 0 0 0 3px #aeb6b9;
    outline: none;
  }
}
</style>
